import React, { useState } from 'react'
import { useSelector, useDispatch } from 'react-redux'
import { UndoOutline } from 'antd-mobile-icons'
import { Button } from 'antd-mobile'
import { CalendarPickerView } from 'antd-mobile'
import { Popup } from 'antd-mobile'
import { useTm } from '../../store/slice/ticket'
import dayjs from 'dayjs'
import { useNavigate } from 'react-router-dom'
import Mylogin from '../../compont/Mylogin'
const Index = () => {
    // let [istor]=Mylogin()
    const nav=useNavigate()
    const form = useSelector((store) => store.counter.form)
    const to = useSelector((store) => store.counter.to)
    const data = useSelector((store) => store.counter.data)
    const data1=dayjs(data).format('YYYY-MM-DD')
    const [visible5, setVisible5] = useState(false)
    const avatar = localStorage.getItem('avatar')
    const username = localStorage.getItem('username')
    const dispath = useDispatch()
    const ontim=(value)=>{
        dispath(useTm(value.toString()))
        setVisible5(false)
    }
    const tz=()=>{
        nav(`/cp?&start=${form}&end=${to}&date=${data1}&isSpeed=true`)
    }
    return (
        <div>
            <div>头像:<img style={{ width: '40px', height: '40px', borderRadius: '50%' }} src={avatar} alt="" /> 昵称:{username}</div>
            <div>
                <h2>火车票预订</h2><p>便建购票 服务您的每一次出行</p>
            </div>
            <div style={{ marginTop: '10px', textAlign: 'center' }}>
                <div style={{ fontSize: '20px' }}><span>{form}</span><span><UndoOutline /></span><span>{to}</span></div>
               <hr/>
                <div style={{width:'100%',height:'30px',lineHeight:'30px'}}>
                    <span style={{float:'left'}} onClick={() => setVisible5(true)}>{data1}</span>
                </div>
                <hr />
                <div>
                    <Button style={{ width: '100%', background: '#000', color: '#fff' }} onClick={tz}>查询</Button>
                </div>
                <hr />
                <div style={{width:'100%',height:'30px'}}>
                    <span style={{ float: 'left' }}>{form}→{to}</span><span style={{ float: 'right' }}>清空</span>
                </div>
            </div>
            <Popup
                visible={visible5}
                onMaskClick={() => {
                    setVisible5(false)
                }}
                bodyStyle={{
                    borderTopLeftRadius: '8px',
                    borderTopRightRadius: '8px',
                    minHeight: '40vh',
                }}
            >
                <CalendarPickerView
                    min={Date.now()}
                    max={Date.now() + 12 * 24 * 60 * 60 * 1000}
                    onChange={ontim}
                />
            </Popup>
        </div>
    )
}

export default Index
